.error-tip {
    position: absolute;
    top: 0;
    margin: 24rpx 32rpx;
    padding: 24rpx 32rpx;
    background: rgba(255, 255, 255, 0.98);
    border-radius: 16rpx;
    transform: translateY(-20rpx) scale(0.95);
    opacity: 0;
    transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    pointer-events: none;
    box-shadow: 0 4rpx 24rpx rgba(0, 0, 0, 0.08);
    display: flex;
    align-items: center;
    gap: 16rpx;

    &.show {
        transform: translateY(0) scale(1);
        opacity: 1;
    }

    &::before {
        content: '';
        width: 32rpx;
        height: 32rpx;
        background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23ff4d4f"><path d="M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm-1 15v-2h2v2h-2zm0-10v6h2V7h-2z"/></svg>') center/contain no-repeat;
        flex-shrink: 0;
    }

    .error-text {
        color: #333;
        font-size: 28rpx;
        line-height: 1.5;
        font-weight: 500;
        flex: 1;

        // 添加文本渐变效果
        background: linear-gradient(90deg, #333 0%, #666 100%);
        -webkit-background-clip: text;
        -webkit-text-fill-color: transparent;
    }
}

.course-info-container {
    margin: 14rpx 24rpx;
    padding: 34rpx;
    border-radius: 24rpx;
    position: relative;
    overflow: hidden;
    background-color: rgba(255, 255, 255, 0.2);
    box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);

    // 毛玻璃效果
    .glass-bg {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background: linear-gradient(135deg, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.5));
        backdrop-filter: blur(20px);
        -webkit-backdrop-filter: blur(20px);
        z-index: 1;
    }

    // 内容容器
    .content-wrapper {
        position: relative;
        z-index: 2;
    }

    // 所有内容需要位于毛玻璃层之上
    &>* {
        position: relative;
        z-index: 2;
    }

    .main-info {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        margin-bottom: 14rpx;

        .title-section {
            flex: 1;
            margin-right: 24rpx;

            .title {
                font-size: 32rpx;
                font-weight: 600;
                color: #333;
                line-height: 1.4;
                margin-bottom: 16rpx;
            }

            .tags {
                display: flex;
                flex-wrap: wrap;
                gap: 12rpx;

                .tag {
                    font-size: 24rpx;
                    color: #8155f0;
                    background: rgba(129, 85, 240, 0.1);
                    padding: 4rpx 16rpx;
                    border-radius: 6rpx;
                    margin-top: 8rpx;
                }
            }
        }

        .price-section {
            .current-price {
                font-size: 48rpx;
                font-weight: 600;
                color: #ff6b6b;
                margin-right: 12rpx;
            }

            .original-price {
                font-size: 28rpx;
                color: #999;
                text-decoration: line-through;
            }

            .free-tag {
                font-size: 32rpx;
                color: #52c41a;
                font-weight: 500;
            }
        }
    }

    .video-des {
        display: block;
        font-size: 28rpx;
        color: #666;
        line-height: 1.6;
        font-weight: 500;
        margin-bottom: 14rpx;
        margin-left: 8rpx;
    }

    .video-info {
        display: flex;
        gap: 32rpx;
        margin-bottom: 14rpx;

        .info-item {
            display: flex;
            align-items: center;

            .icon-duration,
            .icon-quality {
                width: 32rpx;
                height: 32rpx;
                margin-right: 8rpx;
            }

            .label {
                font-size: 26rpx;
                color: #666;
            }

            .value {
                font-size: 26rpx;
                color: #333;
                font-weight: 500;
            }
        }
    }

    .description {
        margin-top: 32rpx;
        margin-bottom: 32rpx;

        .course-cover {
            width: 100rpx;
            height: 100rpx;

            border-radius: 10rpx;

            .cover {
                width: 100rpx;
                height: 100rpx;

                border-radius: 10rpx;
            }
        }

        .info {
            display: flex;
            align-items: center;
        }

        .des {
            display: flex;
            align-items: flex-start;
            flex-direction: column;
            margin-left: 14rpx;

            .course-name {
                display: block;
                font-size: 30rpx;
                font-weight: 600;
                color: #333;
                line-height: 1.4;
                margin-bottom: 5rpx;
            }

            .desc-title {
                font-size: 27rpx;
                font-weight: 600;
                color: #999;
                // margin-bottom: 16rpx;
                display: block;
            }
        }

        .desc-content {
            font-size: 28rpx;
            color: #666;
            line-height: 1.6;
        }
    }

    .status-info {
        display: flex;
        gap: 32rpx;
        padding-top: 24rpx;
        border-top: 2rpx solid rgba(0, 0, 0, 0.06);

        .status-item {
            display: flex;
            align-items: center;
            font-size: 26rpx;
            color: #666;

            .icon-calendar,
            .icon-clock {
                width: 28rpx;
                height: 28rpx;
                margin-right: 8rpx;
            }
        }
    }
}

// 添加图标
.icon-duration {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23666"><path d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z"/><path d="M12.5 7H11v6l5.25 3.15.75-1.23-4.5-2.67z"/></svg>') center/contain no-repeat;
}

.icon-quality {
    background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" fill="%23666"><path d="M19 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V5h14v14z"/><path d="M7.5 13h2v2H11V9H9.5v2.5h-2V9H6v6h1.5zM18 14v-4c0-.55-.45-1-1-1h-4v6h4c.55 0 1-.45 1-1zm-1.5-.5h-2v-3h2v3z"/></svg>') center/contain no-repeat;
}

.page-ads-container {
    padding: 20rpx;

    .ad-item {
        margin-bottom: 20rpx;
        background: #fff;
        border-radius: 12rpx;
        overflow: hidden;
        box-shadow: 0 2rpx 12rpx rgba(0, 0, 0, 0.05);

        .ad-image {
            width: 100%;
            height: 300rpx;
            background-color: #f5f5f5;
        }

        .ad-info {
			display: flex;
			align-items: flex-start;
			flex-direction: column;
            padding: 16rpx;

            .ad-title {
                font-size: 28rpx;
                font-weight: 500;
                color: #333;
                margin-bottom: 8rpx;
            }

            .ad-desc {
                font-size: 24rpx;
                color: #666;
                line-height: 1.4;
            }
        }

        &:active {
            opacity: 0.8;
        }
    }
}

// 加载更多提示
.loading-more {
    text-align: center;
    padding: 20rpx;
    color: #999;
    font-size: 24rpx;
}

.history {
  position: relative;
  display: flex;
  flex-direction: column;
  padding: 34rpx;
  margin: 12px 0;
  background-color: rgba(255, 255, 255, 0.2);
  box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.08);
  border-radius: 8px;
  
  .first {
	  display: flex;
	  align-items: center;
	  justify-content: space-between;
	  margin-bottom: 14rpx;
	  
	  // 标题行
	  .title {
	    font-size: 14px;
	    color: #666;
	    display: flex;
	    align-items: center;
	    
	    &::before {
	      content: '';
	      display: inline-block;
	      width: 4px;
	      height: 14px;
	      background: #1890ff;
	      border-radius: 2px;
	      margin-right: 8px;
	    }
	  }
	  
	  .button {
		  font-size: 29rpx;
		  font-weight: 500;
		  color: #1890ff;
	  }
  }
}